import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

import 'package:get/get.dart';
import 'package:signage/app/routes/app_pages.dart';
import 'package:signage/l10n/l10n.dart';
import 'package:signage/widgets/custom_appbar.dart';

import '../controllers/profile_controller.dart';

class ProfileView extends GetView<ProfileController> {
  const ProfileView({super.key});
  @override
  Widget build(BuildContext context) {
    return Obx(() => Scaffold(
          body: Stack(
            children: [
              // 背景图
              Positioned(
                top: 0,
                left: 0,
                right: 0,
                child: Image.asset(
                  'assets/images/title_bar_bg.png',
                  width: Get.width,
                  height: 200.w,
                  fit: BoxFit.cover,
                ),
              ),
              ListView(
                padding: const EdgeInsets.all(16),
                children: [
                  60.verticalSpace,
                  GestureDetector(
                    onTap: () {
                      Get.toNamed(Routes.EDIT_INFO);
                    },
                    child: Row(
                      children: [
                        controller.userInfo.value.avatar != null
                            ? ClipOval(
                                child: Image.network(
                                  controller.userInfo.value.avatar!,
                                  width: 76.w,
                                  height: 76.w,
                                  fit: BoxFit.cover,
                                ),
                              )
                            : Image.asset(
                                'assets/images/Ellipse 2086@2x.png',
                                width: 76.w,
                                height: 76.w,
                              ),
                        11.horizontalSpace,
                        Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Text(controller.userInfo.value.name ?? '',
                                style: const TextStyle(
                                    fontSize: 18, fontWeight: FontWeight.w500)),
                            Text(controller.userInfo.value.mobile ?? '',
                                style: const TextStyle(
                                    fontSize: 16, fontWeight: FontWeight.w500)),
                          ],
                        ),
                        Expanded(
                          child: Container(
                            child: Align(
                              alignment: Alignment.centerRight,
                              child: Image.asset(
                                'assets/images/Group 1321318317@2x (1).png',
                                width: 24.w,
                                height: 24.w,
                              ),
                            ),
                          ),
                        ),
                      ],
                    ),
                  ),
                  15.verticalSpace,
                  // 第一功能区
                  Container(
                    decoration: BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.circular(12),
                    ),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        // ListTile(
                        //   leading: const Icon(Icons.account_circle),
                        //   title: const Text('账号'),
                        //   // trailing: const Icon(Icons.chevron_right),
                        //   onTap: controller.onAccountTap,
                        // ),

                        // Divider(height: 1,
                        //     color: Colors.grey[200], thickness: 0.5),  // 调整这里,
                        ListTile(
                          leading: Image.asset(
                            'assets/images/Group 1321318720@2x.png',
                            width: 24.w,
                            height: 24.w,
                          ),
                          title: Text(AppLocalizations.of(context)!.translate('list_management')),
                          // trailing: const Icon(Icons.chevron_right),
                          onTap: controller.onListManagementTap,
                        ),

                        Divider(
                            height: 1,
                            color: Colors.grey[200],
                            thickness: 0.5), // 调整这里,
                        ListTile(
                          leading: Image.asset(
                            'assets/images/Group 1321318714@2x.png',
                            width: 24.w,
                            height: 24.w,
                          ),
                          title: Text(AppLocalizations.of(context)!.translate('font_management')),
                          // trailing: const Icon(Icons.chevron_right),
                          onTap: controller.onFontManagementTap,
                        ),
                      ],
                    ),
                  ),

                  const SizedBox(height: 16),

                  // 第二功能区
                  Container(
                    decoration: BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.circular(12),
                    ),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        ListTile(
                          leading: Image.asset(
                            'assets/images/Group 1321318722@2x.png',
                            width: 24.w,
                            height: 24.w,
                          ),
                          title: Text(AppLocalizations.of(context)!.translate('language_settings')),
                          trailing: Text(controller.getCurrentLanguage()),
                          onTap: () => _showLanguageDialog(context),
                        ),
                        Divider(height: 1, color: Colors.grey[200], thickness: 0.5),
                        ListTile(
                          leading: Image.asset(
                            'assets/images/Group 1321318721@2x.png',
                            width: 24.w,
                            height: 24.w,
                          ),
                          title: Text(AppLocalizations.of(context)!.translate('transfer_settings')),
                          // trailing: const Icon(Icons.chevron_right),
                          onTap: controller.onTransferSettingsTap,
                        ),
                        Divider(
                            height: 1,
                            color: Colors.grey[200],
                            thickness: 0.5), // 调整这里,
                        ListTile(
                          leading: Image.asset(
                            'assets/images/Group 1321318722@2x.png',
                            width: 24.w,
                            height: 24.w,
                          ),
                          title: Text(AppLocalizations.of(context)!.translate('screen_record')),
                          // trailing: const Icon(Icons.chevron_right),
                          onTap: controller.onScreenRecordTap,
                        ),
                      ],
                    ),
                  ),
// 第二功能区
                  const SizedBox(height: 16),
                  Container(
                    decoration: BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.circular(12),
                    ),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        ListTile(
                          leading: Image.asset(
                            'assets/images/Group 1321318725@2x (1).png',
                            width: 24.w,
                            height: 24.w,
                          ),
                          title: Text(AppLocalizations.of(context)!.translate('clear_cache')),
                          trailing: Text(controller.totalSizeStr.value),
                          onTap: controller.onClearCacheTap,
                        ),

                        Divider(
                            height: 1,
                            color: Colors.grey[200],
                            thickness: 0.5), // 调整这里,
                        ListTile(
                          leading: Image.asset(
                            'assets/images/Group 1321318723@2x.png',
                            width: 24.w,
                            height: 24.w,
                          ),
                          title: Text(AppLocalizations.of(context)!.translate('firmware_upgrade')),
                          // trailing: const Icon(Icons.chevron_right),
                          onTap: controller.onFirmwareUpgradeTap,
                        ),

                        Divider(
                            height: 1,
                            color: Colors.grey[200],
                            thickness: 0.5), // 调整这里,
                        ListTile(
                          leading: Image.asset(
                            'assets/images/Group 1321318726@2x.png',
                            width: 24.w,
                            height: 24.w,
                          ),
                          title: Text(AppLocalizations.of(context)!.translate('about')),
                          // trailing: const Icon(Icons.chevron_right),
                          onTap: () => Get.toNamed(Routes.ABOUT),
                        ),
                      ],
                    ),
                  ),
                  // 第三功能区
                  const SizedBox(height: 20),
                  Container(
                    decoration: BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.circular(12),
                    ),
                    child: Column(
                      children: [
                        ListTile(
                          title: Text(
                            AppLocalizations.of(context)!.translate('logout'),
                            textAlign: TextAlign.center,
                          ),
                          onTap: controller.onLogoutTap,
                        ),
                        ListTile(
                          title: Text(
                            AppLocalizations.of(context)!.translate('delete_account'),
                            textAlign: TextAlign.center,
                            style: TextStyle(color: Colors.red),
                          ),
                          onTap: controller.onLogoutTap2,
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            ],
          ),
        ));
  }

  void _showLanguageDialog(BuildContext context) {
    showDialog(
      context: context,
      builder: (BuildContext context) {
        return AlertDialog(
          title: Text(AppLocalizations.of(context)!.translate('language_settings')),
          content: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              ListTile(
                title: Text(AppLocalizations.of(context)!.translate('language_auto')),
                leading: const Icon(Icons.language),
                onTap: () {
                  controller.changeLanguage(null);
                  Navigator.pop(context);
                },
              ),
              ListTile(
                title: Text(AppLocalizations.of(context)!.translate('language_zh')),
                leading: const Text('🇨🇳'),
                onTap: () {
                  controller.changeLanguage('zh');
                  Navigator.pop(context);
                },
              ),
              ListTile(
                title: Text(AppLocalizations.of(context)!.translate('language_en')),
                leading: const Text('🇺🇸'),
                onTap: () {
                  controller.changeLanguage('en');
                  Navigator.pop(context);
                },
              ),
            ],
          ),
        );
      },
    );
  }
}
